import { NavigateService } from './../../../service/navigate.service';
import { MdDialog, MdDialogRef, MdDialogConfig, MdSnackBar } from "@angular/material";
import { ObjectCopier } from './../../../common/objectCopier';
import { MessageBoxService, GrowlMessageType } from './../../../component/messageBoxService';
import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core';

export class RemindOrderService {
    static current: RemindOrderService = new RemindOrderService();
    private remind: RemindOrderDialog;
    dialogRef: MdDialogRef<RemindOrderDialog>;
    config: MdDialogConfig = {
        disableClose: false,
        width: '100%',
        position: {
            top: '0',
            bottom: '0',
            left: '0',
            right: '0'
        }
    }

    Regist(remind: RemindOrderDialog) {
        this.remind = remind;
    }
    open(dialog: MdDialog, inventories) {
        this.dialogRef = dialog.open(RemindOrderDialog, this.config);
        this.remind.inventoryList = "";
        inventories = this.filterInvt(inventories);
        this.initInventory(inventories);
        this.remind.inventories = inventories;
        this.remind.selectedRemindItems = [];
        return new Promise((resolve, reject) => {
            this.dialogRef.afterClosed().subscribe((inventories) => {
                this.dialogRef = null;
                resolve(inventories);
            })
        });
    }
    initInventory(inventories) {
        if (inventories && inventories.length) {
            inventories.forEach((element, index) => {
                delete element.remindSelected;
            });
        }
    }
    /**
     * 过滤掉已经不能催的菜
     */
    filterInvt(inventories) {
        let result = inventories.filter(invt => {
            if(invt.inventory && invt.inventory.code == 'tablefee'){
                return false;
            }
            let pickUpFlag = true;
            let refundFlag = true;
            if (invt.extended) {
                pickUpFlag = invt.extended.pickup != "waiting";
            }
            if (invt.refundQty) {
                refundFlag = invt.qty > invt.refundQty;
            }
            return (pickUpFlag && refundFlag);
        });
        result = ObjectCopier.Copy(result);
        return result;
    }
}

@Component({
    //moduleId: module.id,
    selector: 'div[remind-order]',
    template: `
        <md-dialog-content fxLayout="column" fxFlex="100%" class="remind-order-content">
            <header tabindex="0" autofocus class="app-header noshrink">
                <span id="dialog-back-btn" class="i-arrow-back margin-l header-icon" (click)="cancel()"></span>
                <span fxFlex="100%" class="margin-l-xs">催菜</span>
            </header>
            <div fxLayout="column" fxFlex="100%">
                <div fxLayout="row" class="text-s color-lightgray remind-order-list noshrink">
                    <div fxLayout="row" fxFlex="100%">
                        <span>{{inventoryList}}</span>
                    </div>
                    <md-checkbox class="noshrink" (change)="selectAllInvt($event)" [checked]="ckeckAll()" [disableRipple]="true">
                        选择全部
                    </md-checkbox>
                </div>
                <div class="table-container v-scroll" fxLayout="row" fxLayoutWrap="wrap" *ngIf="inventories && inventories.length">
                    <div fxFlex="33.3%" fxFlex.gt-xs="25%" fxLayoutAlign="center center" *ngFor="let invt of inventories;let index = index">
                        <div fxLayout="column" class="table-item text-xs" [ngClass]="{'table-open': invt.checked}" (click)="selectRemindItem(invt)">
                            <div class="table-item-info" fxLayout="column" fxFlex="100%">
                                <span fxFlex="100%" class="table-name">{{invt.inventoryName}}</span>
                            </div>
                            <div fxLayout="row" fxLayoutAlign="start center" class="table-item-data text-xs noshrink">
                                <span class="table-item-icon" *ngIf="!invt.inventory.unit || invt.inventory.unit.unitType != 'weight'">{{invt.qty - (invt.refundQty ? invt.refundQty : 0)}}</span>
                                <span *ngIf="invt.inventory.unit && invt.inventory.unit.unitType == 'weight'">{{invt.qty - (invt.refundQty ? invt.refundQty : 0) | number:'1.2-3'}}</span>
                                <span>{{invt.inventory.unit ? invt.inventory.unit.name : ""}}</span>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="text-center v-gap" *ngIf="!inventories || !inventories.length">
                    <span>没有需要催的菜</span>
                </div>
            </div>
            <button class="bgcolor-primary color-white pct100 noshrink normal-btn text-m" md-button (click)="ok()">确定</button>
        </md-dialog-content>
    `,
    styleUrls: ['../tableDetail.component.scss']
})
export class RemindOrderDialog implements OnInit {
    constructor(
        private msgSvr: MessageBoxService,
        public dialogRef: MdDialogRef<RemindOrderDialog>,
        public snackBar: MdSnackBar,
        private navSvr: NavigateService
    ) {
        RemindOrderService.current.Regist(this);
    }
    inventories = [];
    selectedRemindItems = [];
    inventoryList = "";
    snackBarRef = null;

    ngOnInit() {
        this.navSvr.registGoBack(() => {
            let backBtn = document.getElementById("dialog-back-btn");
            if (backBtn) {
                backBtn.click();
            }
        });
    }
    /**
     * 选择需要催菜的选项
     * @param  {} item
     */
    selectRemindItem(item) {
        item.checked = !item.checked;
        if (item.checked) {
            this.selectedRemindItems.push(item);
        } else {
            for (let i = 0; i < this.selectedRemindItems.length; i++) {
                if (item.id == this.selectedRemindItems[i].id) {
                    this.selectedRemindItems.splice(i, 1);
                    break;
                }
            }
        }
        this.buildInventoryList(this.selectedRemindItems);
    }
    /**
     * 根据选中的项构建文字提示
     */
    buildInventoryList(selectedRemindItems) {
        this.inventoryList = "";
        if (selectedRemindItems && selectedRemindItems.length) {
            selectedRemindItems.forEach((item, index) => {
                if (index == 0) {
                    this.inventoryList += item.inventoryName;
                } else if (index < 2) {
                    this.inventoryList += ("，" + item.inventoryName);
                }
            });
            if (selectedRemindItems.length > 2) {
                this.inventoryList += ("等" + selectedRemindItems.length + "项");
            }
        }
    }
    /**
     * 全选
     */
    selectAllInvt(event) {
        this.selectedRemindItems = [];
        this.inventories.forEach((element) => {
            element.checked = event.checked;
            if (element.checked) {
                this.selectedRemindItems.push(element);
            }
        });
        this.buildInventoryList(this.selectedRemindItems);
    }

    ckeckAll() {
        if (!this.selectedRemindItems.length) {
            return false;
        }
        return this.selectedRemindItems.length == this.inventories.length;
    }
    /**
     * 取消
     */
    cancel() {
        this.selectedRemindItems = [];
        this.dialogRef.close(null)
    }

    /**
     * 确定催菜
     */
    ok() {
        if (!this.selectedRemindItems || !this.selectedRemindItems.length) {
            if (!this.snackBarRef) {
                this.snackBarRef = this.msgSvr.Growl(GrowlMessageType.Warning, this.snackBar, "未选择需要催菜的菜品");
                this.snackBarRef.afterDismissed().subscribe(() => {
                    this.snackBarRef = null;
                });
            }
            return;
        }
        this.dialogRef.close(this.selectedRemindItems)
    }
}